<!DOCTYPE html>
<html lang="en">

	<head>
		<meta charset="UTF-8">
		<title>二维码首页</title>
		<link href="css/common.css" rel="stylesheet" type="text/css" />
		<link href="css/normolize.css" rel="stylesheet" type="text/css" />
		<!--[if IE 9]> <link href="css/ieHack9.css" rel="stylesheet" type="text/css" /> <![endif]-->
		<!--[if IE 8]> <link href="css/ieHack.css" rel="stylesheet" type="text/css" /><link href="css/ieHack8.css" rel="stylesheet" type="text/css" /> <![endif]-->
		<!--[if lte IE 7]> <link href="css/ieHack.css" rel="stylesheet" type="text/css" /> <![endif]-->

		<style>
		div:not(.header){
			transition: all .2s ease-in;
			-webkit-transition: all .2s ease-in;
		}
		.hidden{opacity:0 }
			.pronumber,
			.qrnumber,
			.ordernumber {
				width: 200px;
				height: 140px;
				padding: 40px 10px;
			}
			
			.ordernumber {
				width: 500px;
				margin: 0 10px;
			}
			
			.page-container {
				padding: 15px 39px 0px 19px;
			}
			
			.pronumber .number .countdata,
			.qrnumber .number .countdata,
			.ordernumber .number .countdata {
				font-size: 34px;
				word-break: break-all;
			}
			
			.pronumber table,
			.qrnumber table,
			.ordernumber table {
				width: 100%;
			}
			.units{font-size:16px;}
			.pronumber table td,
			.qrnumber table td,
			.ordernumber table td {
				height: 60px;
				vertical-align: middle;
			}
			
			table td.numberIconTd {
				/*width: 43px;*/
			}
			
			.pronumber p,.pronumber span,
			.qrnumber p,.qrnumber span,
			.ordernumber p,.ordernumber span {
				color: #fff;
			}
			
			.numberIcon {
				width: 43px;
				height: 65px;
				background: url(images/Index/numberIcon.png) no-repeat;
				background-position: -60px 11px;
				display: inline-block;
				vertical-align: middle;
			}
			.more:hover{text-decoration: underline;}
			.ordernumber .numberIcon {
				background-position: -207px 11px;
				margin-left: 27px;
			}
			
			.qrnumber .numberIcon {
				background-position: -341px 11px;
				margin-left: 16px;
				margin-right: 15px;
			}
			
			.container_title {
				margin-top: 20px;
			}
			
			.container_title .title {
				border-bottom: 1px solid #ddd;
				height: 40px;
				line-height: 40px;
				padding-left: 10px;
				background: #eee;
				
			}
			
			.planorderPro {
				width: 63px;
				height: 63px;
				border: 1px solid #ddd;
			}
			
			.planOrderList ul {
				padding: 10px 3px;
				margin-top: -20px;
				width: 100%;
			}
			
			.planOrderList ul li {
				width: 442px;
				height: 121px;
				margin-top: 20px;
				float: left;
				border: 1px solid #ddd;
				padding-left: 10px;
				padding-top: 6px;
				padding-right: 10px;
				
				margin-left: 7px;
				margin-right:7px;
			}
			
			
			
			
			
			.planOrderList ul li table {
				margin-top: 20px;
			}
			
			.planOrderList ul li table td {
				vertical-align: bottom;
				position: relative;
			}
			
			.newestIcon {
				background: url(images/newest.png) no-repeat;
				width: 28px;
				height: 14px;
				display: inline-block;
				position: absolute;
				right: 0px;
				top: -7px;
			}
			
			.planOrderList ul li span,
			.planOrderList ul li p {
				color: #999;
			}
			
			.planOrderList ul li p.darkgrey {
				color: #666;
			}
			
			.planOrderList ul li span.colorblue {
				color: #17a3d7;
			}
			
			.planOrderList ul li table td img {
				margin-right: 12px;
			}
		</style>
	</head>

	<body>
		<script src="js/tpl/yimaduosao.js" type="text/javascript" charset="utf-8"></script>
		 
		<div class="page-wrapper productlist minwidth border" id="page-wrapper">
			<div class="line"></div>
			
			<script src="js/tpl/menu.js" type="text/javascript" charset="utf-8"></script>
			
			<div class="page-content">

				<div class="page-container">
					<div class="dataNumberContent over-hidden ">
						<div class="pronumber bgblue fl">
							<table>
								<tr>
									<td class="numberIconTd">
										<i class="numberIcon"></i>
									</td>
									<td>
										<p class="number"><span class="countdata ">126</span><span class="units"></span></p>
										<p>产品数量</p>
									</td>
								</tr>
							</table>
						</div>
						<div class="ordernumber bgblue fl">
							<table>
								<tr>
									<td class="numberIconTd">
										<i class="numberIcon"></i>
									</td>
									<td class="">
										<p class="number"><span class="countdata ">12656455665</span><span class="units"></span></p>
										<p>计划单数</p>
									</td>
									<td class="">
										<p class="number"><span class="countdata ">126565</span><span class="units"></span></p>
										<p>计划单码数</p>
									</td>
									<td class="">
										<p class="number"><span class="countdata ">126</span><span class="units"></span></p>
										<p>铺货总码数</p>
									</td>
								</tr>
							</table>
						</div>
						<div class="qrnumber bgblue fl">
							<table>
								<tr>
									<td class="numberIconTd">
										<i class="numberIcon"></i>
									</td>
									<td>
										<p class="number"><span class="countdata">12656455665</span><span class="units"></span></p>
										<p>已扫二维码</p>
									</td>
								</tr>
							</table>
						</div>
					</div>

					<div class="container_title border">
						<p class="title">最近十五天扫码统计</p>
						<div class="charts">
							<div id="main" style="width:100%;height:240px;"></div>
						</div>

					</div>

					<div class="container_title border planOrderList over-hidden" style="margin-bottom:80px;">
						<p class="title">喷码计划单 <span class="fr"><a href="#" target="_blank" style="color:#666;margin-right:20px;" class="more">查看更多 ></a> </span></p>
						<div class="clearfix"></div>
						
						<!--这里是有计划单-->
						<ul class="over-hidden ">
							<li>
								<p class="darkgrey">计划单 <span class="fr">截止时间：2016-07-13</span></p>
								<div>
									<table>
										<tr>
											<td><img src="images/product/product2.png" class="planorderPro " /><span class="newestIcon"></span> </td>
											<td>
												<p>
													<span style="margin-right:20px;">产品名称：棒子酒</span>
													<span>数量：17500</span>
												</p>
												<p style="margin-top:9px;">
													<span style="margin-right:20px;">计划单名称：<span class="colorblue">新春特惠酬宾计划</span></span>
													<span>状态：已关闭</span>
												</p>
											</td>
										</tr>

									</table>
								</div>
							</li>
							<li>
								<p class="darkgrey">计划单 <span class="fr">截止时间：2016-07-13</span></p>
								<div>
									<table>
										<tr>
											<td><img src="images/product/product2.png" class="planorderPro" /> </td>
											<td>
												<p>
													<span style="margin-right:20px;">产品名称：棒子酒</span>
													<span>数量：17500</span>
												</p>
												<p style="margin-top:9px;">
													<span style="margin-right:20px;">计划单名称：<span class="colorblue">新春特惠酬宾计划</span></span>
													<span>状态：已关闭</span>
												</p>
											</td>
										</tr>

									</table>
								</div>
							</li>
							<li>
								<p class="darkgrey">计划单 <span class="fr">截止时间：2016-07-13</span></p>
								<div>
									<table>
										<tr>
											<td><img src="images/product/product2.png" class="planorderPro" /> </td>
											<td>
												<p>
													<span style="margin-right:20px;">产品名称：棒子酒</span>
													<span>数量：17500</span>
												</p>
												<p style="margin-top:9px;">
													<span style="margin-right:20px;">计划单名称：<span class="colorblue">新春特惠酬宾计划</span></span>
													<span>状态：已关闭</span>
												</p>
											</td>
										</tr>

									</table>
								</div>
							</li>
							<li>
								<p class="darkgrey">计划单 <span class="fr">截止时间：2016-07-13</span></p>
								<div>
									<table>
										<tr>
											<td><img src="images/product/product2.png" class="planorderPro" /> </td>
											<td>
												<p>
													<span style="margin-right:20px;">产品名称：棒子酒</span>
													<span>数量：17500</span>
												</p>
												<p style="margin-top:9px;">
													<span style="margin-right:20px;">计划单名称：<span class="colorblue">新春特惠酬宾计划</span></span>
													<span>状态：已关闭</span>
												</p>
											</td>
										</tr>

									</table>
								</div>
							</li>
						</ul>
						<!--这里是无计划单-->
						<div class="noOrderPlan none" style="height:300px; text-align: center; line-height: 300px;">
							<img src="images/Index/noorderPlan.png"  />
						</div>
						
					</div>

				</div>

			</div>
		</div>

		<div class="footer">
			<div class="footercontainer">
				<ul>
					<li>
						<a href="#">关于我们</a>
					</li>
					<li>
						<a href="#">服务与支持</a>
					</li>
					<li>
						<a href="#">常见问题</a>
					</li>
					<li>
						<a href="#">人才招聘</a>
					</li>
					<li>
						<a href="#">加盟合作</a>
					</li>
				</ul>

				<div style="margin-top:13px;">版权所有@ 2015 - 2016 深圳在乎传媒科技有限公司 粤ICP备15107022-1号</div>
			</div>

		</div>

		<!--这里是删除产品的弹框（无法删除）-->

	</body>

	<script src="js/jquery-1.8.2.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/js.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/echart/echarts.common.min.js" type="text/javascript"></script>
	<script src="js/echart/echartOperate.js" type="text/javascript"></script>

	<script>
        //计算统计数量单位
        function count(){
        	$('.number .countdata').each(function(){
        		var _self=this;
        		var number=$(_self).html();
        		var len=number.length;
        		var intNum=parseInt(number);
        		if(len>4 && len<9){
        			intNum= (intNum/10000).toFixed(1);
        			$(_self).next('.units').html('万');
        		}else if(len>=9){
        			intNum=(intNum/100000000).toFixed(1);
        			$(_self).next('.units').html('亿');
        		}
        		$(_self).html(intNum);
        		$('.dataNumberContent').removeClass('hidden');
        	})
        }
		$(function() {
			count();
			/*//柱状图
			var timearr = ['4-11', '4-12', '4-13', '4-15', '4-21', '4-22', '4-23', '5-1', '5-2', '5-3', '5-4', '5-10', '5-11', '5-12'];
			var dataarr = [120, 132, 101, 134, 90, 230, 210, 120, 132, 101, 134, 90, 230, 210, 120];
			createBarChart("main", dataarr, "fdsfd", timearr);*/

		});
	</script>

</html>